﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>监测点数据</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta name="format-detection" content="telephone=no" />
    <!--最新xc无滚动条-->
    <style type="text/css">
.pDiv{width: 97%;padding-top: 1px;padding-bottom: 0px;margin-top: 0px;border-bottom: 0px solid #ccc;border-top: 1px solid #ccc;font-family: 黑体;font-size: 0.9em;color: White;float: none;margin:0 auto;}
.headDiv{width: 100%;height: 30px;line-height: 30px;border-bottom: 1px solid #ccc;float: none;margin:0 auto;background-image: url('');
         background-position:-4% 52%;background-repeat: no-repeat;color: white;font-family: 黑体;text-align: center;}
.headDiv_station{width: 49%;height: 30px;line-height: 30px;float: left;margin:0 auto;color: white;font-family: 黑体;text-align: left;text-indent:3em;}
.headDiv_qr{width: 50%;height: 30px;line-height: 30px;float: right;margin:0 auto;color: white;font-family: 黑体;text-align: left;}
.dataDiv{width: 100%;float: none;margin: 0 auto;overflow: hidden;display: none;}
.data50Div{height: 20px;line-height: 20px;width: 50%;float: left;text-align: center;color: #428BCA;}
.data100Div{height: 20px;line-height: 20px;width: 100%;float: left;text-align: center;color: #428BCA;}
.infoBtn{height: 30px;line-height: 30px;width: 100%;text-align: center;float: left;margin: 0 auto;background-color: #FF6600;color: White;}
.positionDiv{height:30px;line-height:30px;font-size:0.8em;margin:4px auto 0 auto;font-family: 宋体;text-align: center;color: #333;width: 90%;background-color:White;border:1px solid #e1e1e1;cursor:pointer;}
    </style>
      <script src="http://hsjdtech.com/inter/scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var menueStu = "homeMenue";
        $(document).ready(function () {
            $("#positionName").html("全国");
            getPosition();
        });
        //省市选择
        function showPosition() {
            $("#mainDiv").hide();
            $("#positionDiv").show();
        }
        function getPosition() {
            var provinceID = ["all", "chongqing", "gansu", "guizhou", "hubei", "neimeng", "ningxia", "shanxi", "sichuan", "yunnan", "shandong", "shanxi1", "heilongjiang", "anhui"];
            var provinceName = ["全国", "重庆", "甘肃", "贵州", "湖北", "内蒙古", "宁夏", "陕西", "四川", "云南", "山东", "山西", "黑龙江", "安徽"];
            for (var i = 0; i < provinceID.length; i++) {
                var posotionStr = "<div onclick=\"positionClick('province','" + provinceID[i] + "','" + provinceName[i] + "',this)\" class='positionDiv'>" + provinceName[i] + "</div>";
                $("#positionDiv").append(posotionStr);
            }
        }
        function showawsInfo(obj) {
            if ($(obj).attr("name") == "select") {
                $(obj).siblings(".dataDiv").animate({ height: "0px" }, 300, function () {
                    $("#mainDiv").height($("#listDiv").height() + $("#menueDiv").height());
                });
                $(obj).attr("name", "");
            }
            else {
                $(obj).siblings(".dataDiv").animate({ height: "135px" }, 300, function () {
                    $("#mainDiv").height($("#listDiv").height() + $("#menueDiv").height());
                });
                $(obj).attr("name", "select");
            }
        }
        function closeawsInfo(obj) {
            $(obj).parent(".dataDiv").animate({ height: "0px" }, 300, function () {
                $("#mainDiv").height($("#listDiv").height() + $("#menueDiv").height());
            });
            $(obj).parent(".dataDiv").siblings(".headDiv").attr("name", "");
        }
        function positionClick(ptype, position, positionName, obj) {
            $("#positionName").html(positionName);
            //getStationdatanow(position);
            $("#mainDiv").show();
            $("#positionDiv").hide();
            window.self.top.scrollTo(0, 0);
        }
    </script>
</head>
<body style="margin: 0px; padding: 0px; font: normal 100% Helvetica, Arial, sans-serif;">
    <div style="width: 100%; float: left;">
        <div id="headDiv" style="width: 100%; height: 60px; float: left; overflow: hidden;
            background-color: #3b5998; border-bottom: 1px solid #BEBEBE; position:fixed; top:0px;">
            <div id="titleDiv" style="height: 60px; width: 100%; background-repeat: repeat-x;
                overflow: hidden;">
                <div id="TBtitle" style="height: 60px; line-height: 60px;   float: left;
                    text-align: left; font-size: 1em; margin-left:20px; font-family: 楷体; font-weight: bold; color: White; ">
                    监测点数据
                </div>
                <div onclick="showPosition()" style="height: 60px; width: 100px; line-height: 60px;
                    cursor: pointer; float: right; background-color: #3b5998; text-align: center;
                    font-size: 0.9em; font-family: 黑体; color: White; overflow: hidden;">
                    <div style="height:60px; width:50px; float:left; line-height:60px; text-align:center; font-size:0.7em;">
                    区域选择:
                    </div>
                    <div style="height: 20px; width: 50px; float: left; margin-top: 14px;">
                        <div style="height: 20px; width: 15px; float: none; margin-left: auto; margin-right: auto;
                            background-image: url(''); background-position: left top;
                            background-size: 80% 80%; background-repeat: no-repeat;">
                        </div>
                    </div>
                    <div id="positionName" style="height: 20px; line-height: 16px; width: 50px; float: left;
                        font-size: 0.7em; text-align: center;">
                        内蒙古</div>
                </div>
            </div>
        </div>            
            <div id="mainDiv" style="width: 100%; float: left; overflow: hidden; margin-top:60px;"> 
                <div id="listDiv" style="width: 100%; float: left;">
                    <div class="pDiv">
                        <div onclick="showawsInfo(this)" class="headDiv" style="background-color:#1FA67A">
                            <div class="headDiv_station">北培金刀峡</div>
                            <div class="headDiv_qr">&nbsp;无侵染</div>
                        </div>
                        <div class="dataDiv">
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">温度：19.6℃</div>
                                <div class="data50Div">湿度：85%</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">降水：0mm</div>
                                <div class="data50Div">风速：---m/s</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">经度：106.67</div>
                                <div class="data50Div">纬度：30.04</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data100Div" style="color: #666;">最近数据时间：2018-04-24 06:00</div>
                            </div>                            
                            <div style="height: 20px; width: 100%; float: none">
                                <div class="data100Div" style="color: #666;">地址：重庆市 北培区 金刀峡镇 胜天湖村</div>
                            </div>
                            <div onclick="closeawsInfo(this)" class="infoBtn" style="background-color:#1FA67A">无侵染<font style="float: right; margin-right: 10px;">收起</font></div>
                        </div>
                    </div>
                    <div class="pDiv">
                        <div onclick="showawsInfo(this)" class="headDiv" style="background-color:red">
                            <div class="headDiv_station">北培金刀峡</div>
                            <div class="headDiv_qr">&nbsp;无侵染</div>
                        </div>
                        <div class="dataDiv">
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">温度：19.6℃</div>
                                <div class="data50Div">湿度：85%</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">降水：0mm</div>
                                <div class="data50Div">风速：---m/s</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data50Div">经度：106.67</div>
                                <div class="data50Div">纬度：30.04</div>
                            </div>
                            <div style="height: 20px; width: 100%; float: none;">
                                <div class="data100Div" style="color: #666;">最近数据时间：2018-04-24 06:00</div>
                            </div>                            
                            <div style="height: 20px; width: 100%; float: none">
                                <div class="data100Div" style="color: #666;">地址：重庆市 北培区 金刀峡镇 胜天湖村</div>
                            </div>
                            <div onclick="closeawsInfo(this)" class="infoBtn" style="background-color:red">无侵染<font style="float: right; margin-right: 10px;">收起</font></div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="positionDiv" style="width: 100%; float: left; overflow: hidden; margin-top:60px; display: none;"></div>
    </div>
</body>
</html>
